import React, { Component } from 'react';
import { Form } from 'antd';
import StaticEditTable from '../../Common/StaticEditTable/StaticEditTable';
import styles from '../../../index.less';
import * as config from '../../../utils/config';

const FormItem = Form.Item;

class TabClassifyComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      sTabId: props.app.currentPane.key, /* 当前标签 */
      componentName: props.componentName, /* 组件名 */
      masterConfig: props.masterConfig, /* 配置 */
      formData: props.formData, /* 配置 */
      sActiveId: props.sActiveId, /* 窗体Id */
      disabled: props.disabled, /* 是否是查看状态 */
      sId: props.sId, /* 业务数据Id */
      classifyConfig: [], /* 印件信息表配置 */
      headerConfig: [], /* 表头配置 */
      // dataListOld: [{
      //   key: '1', iOrder: 1, sProductClassifyId: 1,
      // }, {
      //   key: '2', iOrder: 2, sProductClassifyId: 2,
      // }, {
      //   key: '3', iOrder: 3, sProductClassifyId: 3,
      // }, {
      //   key: '4', iOrder: 4, sProductClassifyId: 4,
      // }],
    };
  }

  componentWillMount() {
    /* 获取表数据 */
    const {
      formData, sActiveId, sId, sTabId, componentName, masterConfig,
    } = this.state;
    const { dispatch } = this.props;
    const classifyTable = formData.filter(item => (item.sTbName.toLowerCase() === 'sisprocessclassifyproductclassify'))[0];
    const classifyConfig = classifyTable.gdsconfigformslave;
    /* 表Id */
    const value = {
      sSqlCondition: {
        sParentId: sId,
      },
    };
    const dataUrl = `${config.server_host}/sisproductclassify/getSisproductclassify?sModelsId=${sActiveId}`;
    dispatch({
      type: 'content/getUrlPostData',
      payload: {
        url: dataUrl, sTabId, componentName: 'sisprocessclassifyproductclassify', value, formRoute: '/sisprocessclassifyproductclassify', returnType: 'data',
      },
    });
    if (masterConfig.sId !== '') {
      const contactId = masterConfig.sId;
      const url = `${config.server_host}business/getBusinessDataByFormcustomId/${contactId}?sModelsId=${sActiveId}`;
      dispatch({
        type: 'content/getUrlPostData',
        payload: {
          url, sTabId, componentName, value, formRoute: '/sisprocessclassifyproductclassify', returnType: 'data',
        },
      });
    }


    /* 获取表头 */
    const headerConfig = [];
    for (const child of classifyConfig) {
      if (child.sName !== '' && child.bVisible && child.showName !== '') {
        headerConfig.push({
          title: child.showName,
          dataIndex: child.sName,
          width: child.iFitWidth,
        });
      }
    }
    this.setState({ headerConfig, classifyConfig });
  }

  componentWillReceiveProps(nextProps) {
    const { disabled, content } = nextProps;
    const { dataList } = content;
    const {
      sDataListTabId, returnType, loading, componentName,
    } = dataList;
    if (this.state.sTabId === sDataListTabId && this.state.sTabId === nextProps.app.currentPane.key
      && this.state.componentName === componentName) {
      if (loading) return;
      if (returnType === 'data') {
        if (componentName === 'sisprocessclassifyproductclassify') {
          this.setState({ disabled });
        }
      }
    }
    this.setState({ disabled });
  }

  shouldComponentUpdate(nextProps) {
    const { componentName } = nextProps;
    let flag = true;
    if (nextProps.disabled !== this.state.disabled) {
      return true;
    }
    /* 弹窗数据回显需要刷新列表 */
    if (nextProps.refreshList) {
      return true;
    }
    if (nextProps.disabled === this.state.disabled && nextProps.disabled === false) {
      return false;
    }
    if (this.state.sTabId === nextProps.app.currentPane.key &&
      this.state.componentName === componentName) {
      flag = true;
    } else {
      flag = false;
    }
    return flag;
  }

  /* 用于返回列表编辑框弹窗所属行主键 */
  handleRecordKey = (key) => {
    this.props.handleRecordKey({ classifyDataKey: key });
  }

  render() {
    const {
      app, form, handleClassifyData, dataName, dataType, handleModalPane, handleSelect, onSelectRowKeys, selectedRowKeys, dataExist, dataList, onSlaveAdd, onClose,
    } = this.props;
    const {
      headerConfig, disabled, classifyConfig, sActiveId,
    } = this.state;
    const { handleRecordKey } = this;
    const staticEditProps = {
      sActiveId,
      showConfigList: classifyConfig,
      headerConfig,
      dataListAll: dataExist ? dataList : [],
      disabled,
      handleTableData: handleClassifyData,
      handleRecordKey, /* 用于返回列表编辑框弹窗所属行主键 */
      app,
      form,
      dataName,
      dataType,
      handleModalPane,
      handleSelect,
      btnAddShow: false,
      btnDelShow: false,
      onSelectRowKeys,
      selectedRowKeys,
      onClose,
      onSlaveAdd,
    };
    return (
      <FormItem className={styles.searchForm}>
        <StaticEditTable {...staticEditProps} />
      </FormItem>
    );
  }
}

export default TabClassifyComponent;
